<template>
    <div class="activity">
        <div class="title">精彩活动</div>
        <div class="act_list">
            <img class="shop" src="@/assets/images/card.jpg" alt="">
            <div class="iconfont iconhuodongjieshu ac_sign"></div>
        </div>
        <div class="act_list">
            <img class="shop" src="@/assets/images/card.jpg" alt="">
            <div class="iconfont iconhuodongjieshu ac_sign"></div>
        </div>
        <div class="act_list">
            <img class="shop" src="@/assets/images/card.jpg" alt="">
            <div class="iconfont iconhuodongjieshu ac_sign"></div>
        </div>
        <div class="act_list">
            <img class="shop" src="@/assets/images/card.jpg" alt="">
            <div class="iconfont iconhuodongjieshu ac_sign"></div>
        </div>
        <div class="ac_bottom">
            更多精彩活动,敬请期待...
        </div>
        <!-- 底部logo -->
        <div class="index_bottom">
            <img class="logo" src="@/assets/images/logo.png" />
            <div class="title">杜康消费者俱乐部</div>
            <div class="title">DUKANGCLUB</div>
        </div>
    </div>
</template>

<script>
export default {
    name: 'Activity',
    components:{
        
    },
    data () {
        return {
            
        }
    },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss">
    .activity{
        padding: 50px 30px;
        .title{
            color: #ccb484;
            font-size: 26px;
            line-height: 62px;
        }
        .act_list{
            padding: 20px 0px;
            position: relative;
            width:690px;
            height: 380px;
            .shop{
                width:690px;
                height: 340px;
                border-radius: 15px;
                position:absolute;
                top: 0px;
                left: 0px;
            }
            .ac_sign{
                position: absolute;
                top:10px;
                right: 10px;
                color: #ccb484;
                font-size: 160px;
            }
        }
        .ac_bottom{
            color: #ccb484;
            font-size: 26px;
            line-height: 62px;
            text-align: center;
        }
    }
    .index_bottom{
        width:100%;
        text-align: center;
        padding: 40px 0px;
        .logo{
            width: 140px;
            // height: 160px;
            margin: 20px 0px;
        }
        .title{
            font-size: 26px;
            line-height: 44px;
            color: #ccb484;
        }
    }
</style>
